<template>
  <div class="footer">
    <div class="navigation">
      <span class="first">首页</span>
      <span>商城</span>
      <span class="plus">+</span>
      <span>消息</span>
      <span>我</span>
    </div>
  </div>
</template>

<script>
export default {};
</script>

<style lang="less" scoped>
.navigation {
  height: 35px;
  display: flex;
  justify-content: space-evenly;
  line-height: 35px;
  span {
    display: inline-block;
    margin: 0 15px;
    color: #3e3e3e;
    width: 45px;
  }
  .first {
    font-weight: bolder;
    color: black;
  }
  .plus {
    font-size: 25px;
    color: white;
    width: 35px;
    height: 25px;
    border: 1px solid #ff2742;
    background: #ff2742;
    border-radius: 5px;
    padding-bottom: 5px;
  }
}
.footer{
  background: #fff;
  position: fixed;
  bottom: 0;
  border-bottom: white solid 1px;
}
</style>